<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="./src/css/global.css">
  <link rel="stylesheet" href="./src/css/index.css">
</head>

<body>
  <!-- 顶部导航栏 -->
  <div class="site-nav-cover">
    <div class="layer site-nav-bd">
      <!-- 左侧导航内容 -->
      <ul class="site-nav-bd-left clearfix">
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a class="deep" href="javascript:;">中国大陆</a>
            <span class="fa fa-angle-down"></span>
          </div>
        </li>
        <li class="site-nav-menu">
          <div class="site-nav-menu-header">
            <a href="javascript:;" class="hl">亲，请登录</a>
            <a href="javascript:;">免费注册</a>
          </div>
        </li>
        <li class="site-nav-menu">
          <div class="site-nav-menu-header">
            <a href="javascript:;">手机逛淘宝</a>
          </div>
        </li>
      </ul>
      <!-- 右侧导航内容 -->
      <ul class="site-nav-bd-right clearfix">
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;">我的淘宝</a>
            <span class="fa fa-angle-down"></span>
          </div>
        </li>
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;"><span class="fa fa-shopping-cart hl"></span>购物车</a>
            <span class="fa fa-angle-down"></span>
          </div>
        </li>
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;"><span class="fa fa-star"></span>收藏夹</a>
            <span class="fa fa-angle-down"></span>
          </div>
        </li>
        <li class="site-nav-menu">
          <div class="site-nav-menu-header">
            <a href="javascript:;">商品分类</a>
          </div>
        </li>
        <li class="site-nav-pipe">|</li>
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;">卖家中心</a>
          </div>
        </li>
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;">联系客服</a>
          </div>
        </li>
        <li class="site-nav-menu site-nav-dropdown">
          <div class="site-nav-menu-header">
            <a href="javascript:;"><span class="fa fa-bars hl"></span>网站导航</a>
            <span class="fa fa-angle-down"></span>
          </div>
        </li>
      </ul>
    </div>
  </div>

  <!-- banner -->
  <div class="header-cover">
    <div class="layer header-bd">
      <div class="header-wrap clearfix">
        <!-- logo -->
        <div class="header-logo">
          <!-- seo优化 -->
          <h1>
            <a href="" class="logo-bd">淘宝网</a>
          </h1>
        </div>
        <!-- 搜索框 -->
        <div class="header-search">
          <!-- tab -->
          <div class="search-tab">
            <ul class="tab-list">
              <li class="tab-item active">宝贝</li>
              <li class="tab-item">天猫</li>
              <li class="tab-item">店铺</li>
            </ul>
          </div>
          <!-- 搜索输入框 -->
          <div class="search-panel">
            <div class="input-wrap">
              <i class="fa fa-search"></i>
              <i class="fa fa-camera"></i>
              <input class="search-input" type="text" placeholder="沙拉神器">
            </div>
            <div class="button-wrap">
              <button>搜索</button>
            </div>
          </div>
          <!-- 热门链接 -->
          <div class="search-ft">
            <a href="" class="ft-link hl">夹克</a>
            <a href="" class="ft-link">时尚连衣裙</a>
            <a href="" class="ft-link hl">衬衫</a>
            <a href="" class="ft-link">妈妈装</a>
            <a href="" class="ft-link">新款男鞋</a>
            <a href="" class="ft-link hl">新款裤子</a>
            <a href="" class="ft-link">阔腿裤</a>
            <a href="" class="ft-link">时尚休闲裤</a>
            <a href="" class="ft-link">双肩包</a>
            <a href="" class="ft-link">沙发</a>
            <a href="" class="ft-link">定制窗帘</a>
            <a href="" class="ft-link">蚊帐</a>
            <a href="" class="ft-link fr">
              更多
              <i class="fa fa-angle-right"></i>
            </a>
          </div>
        </div>
        <!-- 手机二维码 -->
        <div class="header-qr">
          <div class="close-btn">
            <i class="fa fa-times"></i>
          </div>
          <a class="qr-bd" href="">
            <span>手机淘宝</span>
            <img src="src/img/qr.png" alt="">
          </a>
        </div>
      </div>
    </div>
  </div>

  <!-- 主导航栏 -->
  <div class="main-nav-cover">
    <div class="layer main-nav-bd clearfix">
      <h2>主题市场</h2>
      <ul class="nav-list main-nav-list">
        <li class="nav-item">
          <a href="" class="nav-link">天猫</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">聚划算</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">天猫超市</a>
        </li>
      </ul>
      <ul class="nav-list">
        <li class="nav-pipe">|</li>
        <li class="nav-item">
          <a href="" class="nav-link">淘抢购</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">电器城</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">司法拍卖</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">中国质造</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">兴农扶贫</a>
        </li>
      </ul>
      <ul class="nav-list">
        <li class="nav-pipe">|</li>
        <li class="nav-item">
          <a href="" class="nav-link">飞猪旅行</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">智能生活</a>
        </li>
        <li class="nav-item">
          <a href="" class="nav-link">苏宁易购</a>
        </li>
      </ul>
    </div>
  </div>

  <!-- 主展示区域盒子 -->
  <div class="layer main-show">
    <!-- 左侧盒子 -->
    <div class="main-show-wrap clearfix">
      <!-- 左侧盒子 内上侧 -->
      <div class="main-show-top clearfix">
        <!-- 左侧二级导航菜单 -->
        <div class="nav-menu">
          <ul class="menu-list">
            <li class="menu-item">
              <a href="" class="menu-link">女装</a> /
              <a href="" class="menu-link">男装</a> /
              <a href="" class="menu-link">内衣</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">鞋靴</a> /
              <a href="" class="menu-link">箱包</a> /
              <a href="" class="menu-link">配件</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">童装玩具</a> /
              <a href="" class="menu-link">孕装</a> /
              <a href="" class="menu-link">用品</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">家电</a> /
              <a href="" class="menu-link">数码</a> /
              <a href="" class="menu-link">手机</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">美妆</a> /
              <a href="" class="menu-link">洗护</a> /
              <a href="" class="menu-link">保健品</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">珠宝</a> /
              <a href="" class="menu-link">眼镜</a> /
              <a href="" class="menu-link">手表</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">运动</a> /
              <a href="" class="menu-link">户外</a> /
              <a href="" class="menu-link">乐器</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">游戏</a> /
              <a href="" class="menu-link">动漫</a> /
              <a href="" class="menu-link">影视</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">美食</a> /
              <a href="" class="menu-link">生鲜</a> /
              <a href="" class="menu-link">零食</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">鲜花</a> /
              <a href="" class="menu-link">宠物</a> /
              <a href="" class="menu-link">农资</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">房产</a> /
              <a href="" class="menu-link">装修</a> /
              <a href="" class="menu-link">建材</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">家具</a> /
              <a href="" class="menu-link">家饰</a> /
              <a href="" class="menu-link">家纺</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">汽车</a> /
              <a href="" class="menu-link">二手车</a> /
              <a href="" class="menu-link">用品</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">办公</a> /
              <a href="" class="menu-link">DIY</a> /
              <a href="" class="menu-link">五金电子</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">百货</a> /
              <a href="" class="menu-link">餐厨</a> /
              <a href="" class="menu-link">家庭保健</a>
              <i class="fa fa-angle-right"></i>
            </li>
            <li class="menu-item">
              <a href="" class="menu-link">学习</a> /
              <a href="" class="menu-link">卡券</a> /
              <a href="" class="menu-link">本地服务</a>
              <i class="fa fa-angle-right"></i>
            </li>
          </ul>
        </div>
        <!-- 轮播图盒子 -->
        <div class="sliders">
          <!-- 主轮播图 -->
          <div class="main-sliders">
            <a href="javascript:;" class="dir-icon dir-forward">
              <i class="fa fa-angle-right"></i>
            </a>
            <a href="javascript:;" class="dir-icon dir-backward">
              <i class="fa fa-angle-left"></i>
            </a>
            <div class="indicator">
              <i class="indicator-dot cur"></i>
              <i class="indicator-dot"></i>
              <i class="indicator-dot"></i>
              <i class="indicator-dot"></i>
              <i class="indicator-dot"></i>
            </div>
            <ul class="main-slider-list">
              <li class="main-slider-item">
                <a href="javascript:;">
                  <img src="./src/img/slider1/1.webp" alt="">
                </a>
              </li>
            </ul>
          </div>
          <!-- 商品轮播图 -->
          <div class="goods-sliders">
            <div class="goods-slider-hd">
              <span class="hd-img"></span>
              <em>理想生活上天猫</em>
              <strong>
                <i>1</i>/6
              </strong>
            </div>
            <!-- 标题 -->
            <div class="tmall-indicator">
              <ul class="indicator-list clearfix">
                <li class="indicator-item selected">
                  <a href=""></a>
                </li>
                <li class="indicator-item">
                  <a href=""></a>
                </li>
                <li class="indicator-item">
                  <a href=""></a>
                </li>
                <li class="indicator-item">
                  <a href=""></a>
                </li>
                <li class="indicator-item">
                  <a href=""></a>
                </li>
                <li class="indicator-item">
                  <a href=""></a>
                </li>
              </ul>
            </div>
            <div class="goods-slider-wrap">
              <!-- 轮播图指示器 -->
              <a href="javascript:;" class="dir-icon dir-forward">
                <i class="fa fa-angle-right"></i>
              </a>
              <a href="javascript:;" class="dir-icon dir-backward">
                <i class="fa fa-angle-left"></i>
              </a>
              <ul class="goods-slider-list">
                <li class="goods-slider-item clearfix">
                  <div class="item-l">
                    <a href="">
                      <img src="./src/img/slider2/1.jpg" alt="">
                    </a>
                  </div>
                  <div class="item-r clearfix">
                    <div class="item-r-img clear-border">
                      <a href="">
                        <img src="./src/img/slider2/2.jpg" alt="">
                      </a>
                    </div>
                    <div class="item-r-img clear-border">
                      <a href="">
                        <img src="./src/img/slider2/3.jpg" alt="">
                      </a>
                    </div>
                    <div class="item-r-img">
                      <a href="">
                        <img src="./src/img/slider2/4.jpg" alt="">
                      </a>
                    </div>
                    <div class="item-r-img">
                      <a href="">
                        <img src="./src/img/slider2/5.jpg" alt="">
                      </a>
                    </div>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- 热卖盒子 -->
        <div class="hot-sales">
          <div class="today-focus">
            <a href="">
              <img src="./src/img/hot_sales/1.webp" alt="">
            </a>
          </div>
          <div class="today-hot">
            <h5>今日热卖</h5>
            <div class="today-hot-img">
              <a href="">
                <img src="./src/img/hot_sales/2.jpg" alt="">
              </a>
            </div>
          </div>
        </div>
      </div>
      <!-- 左侧盒子 内下侧 -->
      <div class="main-show-bottom">
        <!-- 淘宝头条 -->
        <h3>
          <div class="headline-logo">
            <em>淘宝头条</em>
          </div>
          <p class="sub-title">让生活更有趣</p>
        </h3>
        <div class="headline-bd">
          <a href="" class="headline-more">更多<i class="fa fa-angle-right"></i></a>
          <a href="" class="headline-link">
            <img src="./src/img/headline/1.webp" alt="">
            <h4>十月养月季，自己做有机肥，肥料钱都省了</h4>
            <p>
              10月，金秋时节，太阳高高挂，气候逐渐变凉了，月季花们纷纷抢着冒出花骨朵，尽情释放自己的美丽与优雅，这时候，营养补充就非常重要，自己在家学做有机肥，连肥料钱都省了。将废菜叶、瓜果皮、鸡和鱼的内脏、鱼鳞碎骨、蛋壳及霉变食物（花生、瓜子、豆子等）放入小缸或小坛甚至广口瓶中，加水（有条
            </p>
          </a>
        </div>
      </div>
    </div>
    <!-- 右侧盒子 -->
    <div class="funcs-wrap">
      <!-- 淘宝用户 -->
      <div class="tb-member">
        <div class="member-wrap">
          <div class="member-bd">
            <div class="member-avatar">
              <a href="" class="user-link">
              </a>
            </div>
            <span class="member-nick">
              Hi!
              <strong>你好</strong>
            </span>
            <p class="member-event">
              <a href="">
                <i class="tb-icon icon-tjb"></i>
                领淘金币抵钱
              </a>
              <a href="">
                <i class="tb-icon icon-club"></i>
                会员俱乐部
              </a>
            </p>
          </div>
          <div class="member-ft">
            <div class="btns-wrap">
              <a href="" class="tb-btn btn-login">登录</a>
              <a href="" class="tb-btn btn-reg">注册</a>
              <a href="" class="tb-btn btn-reg">开店</a>
            </div>
          </div>
        </div>
      </div>
      <!-- 公告新闻展示区 -->
      <div class="tb-tip">
        <a href="">
          网上有害信息举报专区
          <i class="fa fa-caret-right"></i>
        </a>
      </div>
      <div class="tb-notice">
        <ul class="notice-tab-list">
          <li class="tab-item active">
            <a href="">公告</a>
          </li>
          <li class="tab-item">
            <a href="">规则</a>
          </li>
          <li class="tab-item">
            <a href="">论坛</a>
          </li>
          <li class="tab-item">
            <a href="">安全</a>
          </li>
          <li class="tab-item">
            <a href="">公益</a>
          </li>
        </ul>
        <div class="tb-notice-bd">
          <ul class="notice-list">
            <li class="notice-item">
              <a href="" class="hl">阿里巴巴电商平台去年创造3681万就业机会</a>
            </li>
            <li class="notice-item">
              <a href="">
                阿里与清华成立实验室
              </a>
            </li>
            <li class="notice-item">
              <a href="">
                天猫推“手机无人贩卖机”
              </a>
            </li>
          </ul>
        </div>
      </div>
      <!-- 12宫格图标导航 -->
      <div class="funcs-table">
        <ul class="funcs-list clearfix">
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-chf"></i>
              <p>充话费</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-lx"></i>
              <p>旅行</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-cx"></i>
              <p>车险</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-yx"></i>
              <p>游戏</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-cp"></i>
              <p>彩票</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-dy"></i>
              <p>电影</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-jd"></i>
              <p>酒店</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-lc"></i>
              <p>理财</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-zfw"></i>
              <p>找服务</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-yc"></i>
              <p>演出</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-sdm"></i>
              <p>水电煤</p>
            </a>
          </li>
          <li class="funcs-item">
            <a href="">
              <i class="funcs-icon icon-hcp"></i>
              <p>火车票</p>
            </a>
          </li>
        </ul>
      </div>
      <!-- 阿里app -->
      <div class="tb-apps">
        <div class="tb-apps-wrap">
          <h3>
            阿里APP
            <a href="">
              更多
              <i class="fa fa-angle-right"></i>
            </a>
          </h3>
          <ul class="apps-list clearfix">
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/taobao.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫淘宝</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/tianmao.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫天猫</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/juhuasuan.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫聚划算</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/zhifubao.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫支付宝</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/wangwang.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫旺旺</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/qiandun.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫钱盾</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/gaode.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫高德</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/youku.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫优酷</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/tudou.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫土豆</p>
              </div>
            </li>
            <li class="app-item">
              <a href="">
                <img src="./src/img/apps/taopiaopiao.webp" class="app-icon" alt="">
              </a>
              <div class="app-qr">
                <div class="qr-wrap">
                  <img src="./src/img/apps/qr.jpg" alt="">
                </div>
                <p>扫一扫淘票票</p>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>

  <!-- 生活研究所盒子 -->
  <div class="layer life-study">
    <h3 class="life-study-title">
      <a href="" class="title-img">
        生活研究所
      </a>
      <p class="sub-title">发现属于你的生活方式</p>
    </h3>
    <ul class="goods-list clearfix">
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/1.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">趣玩先锋</h4>
            <p class="sub-title">怪有意思的</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气390979
            </p>
          </div>
        </a>
      </li>
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/2.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">火锅爱好者</h4>
            <p class="sub-title">无火锅不英雄</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气26499
            </p>
          </div>
        </a>
      </li>
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/3.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">轻微萌物癖</h4>
            <p class="sub-title">非萌货慎入</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气917295
            </p>
          </div>
        </a>
      </li>
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/4.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">雅致居家控</h4>
            <p class="sub-title">过我要的生活</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气257794
            </p>
          </div>
        </a>
      </li>
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/5.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">家有萌娃</h4>
            <p class="sub-title">宝贝快快长大</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气2080136
            </p>
          </div>
        </a>
      </li>
      <li class="goods-item">
        <a href="">
          <div class="goods-img">
            <img src="./src/img/life_study/6.webp" alt="">
          </div>
          <div class="goods-info">
            <h4 class="main-title">租房一族</h4>
            <p class="sub-title">生活不是租的</p>
            <p class="other-info">
              <i class="fa fa-heart"></i>
              人气1557565
            </p>
          </div>
        </a>
      </li>
    </ul>
  </div>

  <!-- 右侧网站定位栏 -->
  <div class="site-positioning">
    <i class="icon-wangwang"></i>
    <div class="site-positioning-inner">
      <a href="" class="positioning-block on">
        爱逛<br>好货
      </a>
      <a href="" class="positioning-block pink">
        好店<br>直播
      </a>
      <a href="" class="positioning-block purple">
        品质<br>特色
      </a>
      <a href="" class="positioning-block green">
        实惠<br>热卖
      </a>
      <a href="" class="positioning-block tb-red">
        猜你<br>喜欢
      </a>
      <a href="" class="positioning-block">
        <span>反馈</span>
      </a>
      <a href="" class="positioning-block">
        暴恐<br>举报
      </a>
    </div>
  </div>

  <script src="./src/js/index.js" type="module"></script>
</body>

</html>